阿修的說文解字

何謂 CORS?

MDN 大大表示：

CORS(Cross-Origin Resource Sharing) 是一種使用額外 HTTP 標頭令目前瀏覽網站的使用者代理 (en-US)取得存取其他來源（網域）伺服器特定資源權限的機制。當使用者代理請求一個不是目前文件來源——例如來自於不同網域（domain）、通訊協定（protocol）或通訊埠（port）的資源時，會建立一個跨來源 HTTP 請求（cross-origin HTTP request）。
基於安全性考量，程式碼所發出的跨來源 HTTP 請求會受到限制。例如，XMLHttpRequest 及 Fetch 都遵守同源政策（same-origin policy）。這代表網路應用程式所使用的 API 除非使用 CORS 標頭，否則只能請求與應用程式相同網域的 HTTP 資源。

阿修表示：

Cross-Origin 指的是跨來源，Resource Sharing 指的是共享資料。
因為瀏覽器有一個同源政策，當我用 AJAX 想要取得對方的資料時，對方會檢查你的來源，如果不是他允許的就會擋掉。
只要我跟他的網址不是同源的就會被擋下來，無法順利取得資料。
所謂同源指的是兩份網頁具備相同協定(protocol)、埠號(port)(如果有指定) 以及主機位置(host)。
但如果對方有開 CORS 權限，我就可以撈的到資料。
可以透過 test-cors.org 來查詢對方網址有沒有開權限。

範例

假如我有一個網址是 https://ithelp.ithome.com.tw/articles/10265464
該怎麼判斷是否同源呢?

同源

• https://ithelp.ithome.com.tw/articles/10267960/draft
  只要前面的網址(https://ithelp.ithome.com.tw) 是相同的，就表示是同源。
  後面的(articles/10267960/draft)是表示路徑。

非同源

• http://ithelp.ithome.com.tw/articles/10265464
  因為 https 與 http 的協定不同，所以是非同源。
• http://ithelp.ithome.com.tw:80/articles/10265464
  因為 https 與 http 的埠號不同，所以是非同源，https 預設是443、http 預設是80。
• https://alex.ithome.com.tw/articles/10265464
  因為主機位置不同，一個是 ithelp，一個是 alex，所以是非同源。

為什麼要檔我!

主要是因為安全性的問題，如果不檔的話，當對方知道你的網址時，對方可以寫一段 AJAX 直接取得你網站的機密資料。
像是直接取得你的聊天紀錄或是 email 信件，這樣太危險。

參考：
[1]CORS 完全手冊（一）：為什麼會發生 CORS 錯誤？
[2]MDN:同源政策 (Same-origin policy)
[3]MDN:跨來源資源共用（CORS）